<template>
	<div class="bilet1">
		<div class="bilet2">
			<span class="left1">强力推荐</span>
			<span class="right1">更多></span>
		</div>
		<div class="bilet3">
			<img src="../../../assets/img/mobile/movie1.png" />
			
			<img src="../../../assets/img/mobile/movie2.png" />
			
			<img src="../../../assets/img/mobile/movie3.png" />
		</div>
		<div class="bilet4">
			<span>REST</span>
			<span>复仇者联盟</span>
			<span>匆匆那年</span>
		</div>
	</div>
</template>

<script>
	export default{
		name:'bilet1'
	}
</script>

<style scoped>
	.bilet1{
		width: 100%;
		height: 220px;
		background-color: #343434;
	}
	.bilet2{
		width: 100%;
		height: 30px;
		/* border: 1px solid red; */
	}
	.left1{
		margin-left: 0.5rem;
		color: white;
		line-height: 30px;
	}
	.right1{
		float: right;
		color: white;
		line-height: 30px;
		margin-right: 0.5rem;
	}
	.bilet3{
		display: flex;
	}
	.bilet3 img{
		width: 30%;
		height: 9.375rem;
		margin: auto;
	}
	.bilet4{
		width: 100%;
		height: 40px;
		/* border: 1px solid red; */
		text-align: center;
	}
	.bilet4 span{
		color: white;
		line-height: 2.5rem;
		margin: 9%;
	}
</style>
